<!--
 * @Author: your name
 * @Date: 2021-05-24 15:09:05
 * @LastEditTime: 2021-06-01 14:43:52
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: \遵义报名\zunyi\src\components\navBar.vue
-->
<template>
  <div class="navBar">
    <el-menu :default-active="activeIndex" class="el-menu" mode="horizontal" router>
      <el-menu-item index="/home">首页</el-menu-item>
      <el-menu-item index="/signUpList">我的报名</el-menu-item>
      <el-menu-item index="/certificate">我的证书</el-menu-item>
      <el-menu-item index="/user">我的信息</el-menu-item>
      <div class="user">
        <el-dropdown>
          <span class="el-dropdown-link">
            用户名<i class="el-icon-arrow-down el-icon--right"></i>
          </span>

          <el-dropdown-menu slot="dropdown">
            <el-dropdown-item @click.native="logout" @click="toLogin">退出</el-dropdown-item>
          </el-dropdown-menu>
        </el-dropdown>

        <el-avatar class="avatar" shape="square"></el-avatar>
      </div>
    </el-menu>
    <!-- <infomation></infomation> -->
  </div>
</template>

<script>
export default {  
  data() {
    return {
      activeIndex:"/home"
    };
  },
  methods: {
    logout() {
      console.log(111);
      localStorage.clear()
      this.$router.replace("/")
    },

    toLogin(){
      this.$router.push("./login")
    }
  },
   watch: {
    $route: {
      handler(val) {
        this.activeIndex = val.path
      },
      immediate: true,
      deep: true,
    },
  },
};
</script>

<style lang="scss" scoped>
@import "style/views/navBar.scss"
</style>